<template>
    <el-dialog title="商品信息" :close-on-click-modal="false" :visible.sync="visible" :before-close="cancel" append-to-body
      class="JNPF-dialog JNPF-dialog_center" width="60%">
      <el-row class="JNPF-common-search-box" :gutter="16">
        <el-form @submit.native.prevent>
          <el-col :span="6">
            <el-form-item label="设备编号">
                <el-input
                    v-model="listQuery.fequipmentno"
                    clearable
                    class="filter-item"
                    placeholder="请输入设备编号"
                />
                </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="设备名称">
                <el-input
                    v-model="listQuery.fequipmentname"
                    clearable
                    class="filter-item"
                    placeholder="请输入设备名称"
                />
                </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="">
              <el-button type="primary" @click="getList">查询</el-button>
              <el-button type="success" @click="confirm">确认</el-button>
            </el-form-item>
          </el-col>
        </el-form>
      </el-row>
      <el-table :data="list" border stripe height="400" @row-click="confirm">
        <el-table-column align="center" label="设备编号" prop="fequipmentno" />
        <el-table-column align="center" label="设备名称" prop="fequipmentname" />
        <el-table-column align="center" label="规格" prop="fspec" />
      </el-table>
      <pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
    </el-dialog>
  </template>
  <script>
    import { listinfo } from "@/api/purchase/ordHead"
    export default {
      data() {
        return {
          listQuery: {
            page: 1,
            limit: 20,
            fequipmentno: "",
            fequipmentno: undefined
          },
          list: [],
          total: 0,
          visible: false,
        };
      },
      created() {
        this.getList();
      },
      mounted() { },
      methods: {
        getList() {
            listinfo(this.listQuery)
            .then(res => {
              this.list = res.data.list;
              this.total = res.data.total;
            })
            .catch(res => {
              this.$message({
                message: res,
                type: 'error'
              });
            })
        },
        //
        open(row) {
          this.visible = true;
        },
        confirm(row) {
          this.$emit("confirm", row);
          this.visible = false;
        },
        //
        cancel() {
          this.visible = false;
        },
      },
    };
  </script>